<!DOCTYPE html>
<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html lang="en">
<!--<![endif]-->
<head>
<!-- Basic Page Needs
	================================================== -->
<meta charset="utf-8">
<title><?php echo TITLE; ?></title>
<meta name="description" content="<?php echo DESCRIPTION; ?>">
<meta name="keyword" content="<?php echo KEYWORDS; ?>">
<meta name="author" content="">
<?php fnGetMeta(); ?>

<link type="text/css" rel="stylesheet" href="<?php echo TEMPLATE; ?>bootstrap/css/bootstrap.min.css">
<!-- web font  -->
<link href='https://fonts.googleapis.com/css?family=Roboto:100,300,400|Abel|Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<!-- nekoAnim-->
<link rel="stylesheet" type="text/css" href="<?php echo TEMPLATE; ?>js-plugin/appear/nekoAnim.css">
<!-- icon fonts -->
<link type="text/css" rel="stylesheet" href="<?php echo TEMPLATE; ?>font-icons/custom-icons/css/custom-icons.css">
<style type="text/css">[class^="icon-"],[class*=" icon-"]{font-family:'custom-icons';font-style:normal;font-weight:normal;line-height:1em}</style>
<!-- Custom css -->
<link type="text/css" rel="stylesheet" href="<?php echo TEMPLATE; ?>css/layout.css">
<link type="text/css" rel="stylesheet" href="<?php echo TEMPLATE; ?>css/colors.css">
<link type="text/css" rel="stylesheet" href="<?php echo TEMPLATE; ?>css/custom.css">
<script language="JavaScript">
 $(document).ready(function(){
        $('#send_message').click(function(e){
             
            //Stop form submission & check the validation
            e.preventDefault();
            // Variable declaration
            var name = $('#name').val();
            var email = $('#email').val();
            var phone = $('#phone').val();
             var comnt = $('#comments').val();
            //var capt  =  $('#captcha_code').val();
            var captx=$('#6_letters_codex').val();
            var sdata=$('#comments').val();
            var iChars = "!@#$%^&*+=-\\\;/|\":<>?`~";
            var temp;
            var captchaval=true;
            $('#spcl_error').fadeOut(500);
             // Form field validation
            if(sdata.length != 0)
               {
                   var sdataval=true;
                   //var captchaval=true;
                   for (var a = 0; a < sdata.length; a++) {
                    if (iChars.indexOf(sdata.charAt(a)) != -1) {
                        var sdataval=false;
                        $('#spcl_error').fadeIn(500);
                    }
                    }
               }

            if(comnt.length == 0){
                 comntval = false;
                $('#comnt_error').fadeIn(500);
                
            }else{
                 comntval = true;
                $('#comnt_error').fadeOut(500);
            }
            if(name.length == 0){
                 nameval = false;
                $('#name_error').fadeIn(500);
                
            }else{
                 nameval = true;
                $('#name_error').fadeOut(500);
            }
            if(email.length == 0 || email.indexOf('@') == '-1'){
                 emailval = false;
                $('#email_error').fadeIn(500);
                
            }else{
                emailval=true;
                $('#email_error').fadeOut(500);
            }
            if(phone.length == 0){
                  phoneval = false;
                $('#phone_error').fadeIn(500);
                
            }
             else{
                   phoneval=true;
                $('#phone_error').fadeOut(500);
            }
           
           
           
           
           if(captx.length == 0){
                 captxval = false;
                $('#captx_error').fadeIn(500);
                
            }else{
                 captxval = true;
                 $.post( "<?php echo URL ?>checkSession.php?captcha="+captx, function( data ) { 
                if(data==='false'){   
                    captchaval=false;
                     $('#captx_error').fadeOut(500);
                    $('#capt_error').fadeIn(500);
                }
                else
                {
                     captchaval=true;
                    $('#capt_error').fadeOut(500);   
                    if(nameval==true && emailval==true && phoneval==true && comntval==true && sdataval==true   && captxval==true )
                    {
                        $('#spcl_error').fadeOut(500);
                        $('#send_message').attr({'disabled' : 'true', 'value' : 'Sending...' });
                        $.post('<?php echo URL ?>mail.php',$('#contactfrm').serialize(),function(res){
            if(res == 'sent')
                        {
              $('#mail_success').fadeIn(500);
                        }
                        else
                        { 
            $('#mail_success').fadeIn(500);
                           /* $('#mail_fail').fadeIn(500);*/
                            $('#send_message').removeAttr('disabled').attr('value', 'Send The Message');  
                       }
                        $('#name').val(" "); $('#email').val(" ");$('#phone').val(" ");$('#comments').val(" ");$('#6_letters_codex').val(" ");
                        $('#send_message').removeAttr('disabled').attr('value', 'Send The Message');  
                        });    
                    }       
                }
               
                 });
                $('#captx_error').fadeOut(500);
            }
 
        
        });
 });
 function charonly(e){
var unicode=e.charCode? e.charCode : e.keyCode
if (unicode!=8){ //if the key isn't the backspace key (which we should allow)
if (!(unicode<48||unicode>57)) {//if not a number
alert("please enter the characters only..");
return false
}
} 
}
function numbersonly(e){
var unicode=e.charCode? e.charCode : e.keyCode
if (unicode!=8){ //if the key isn't the backspace key (which we should allow)
if ((unicode<48||unicode>57)&&(unicode!=46)) {//if not a number
alert("please enter the numbers only..");
return false
}
} 
}
</script>
</head>
<body class="activateAppearAnimation header3" style="padding-top:0px;">
<!-- Primary Page Layout 
	================================================== --> 
<!-- globalWrapper -->
<div id="globalWrapper" class="localscroll">
<?php fnGetHeader(); ?>
<section class="inner_banner">
  <div class="container">
    <div class="row">
      <div class="col-sm-6">
        <ul id="navTrail">
          <li><a href="<?php //echo URL; ?>">Home</a></li>
          <li id="navTrailLast">Free Consultation</li>
        </ul>
      </div>
      <div class="col-sm-6 hidden-xs"> &nbsp; </div>
    </div>
  </div>
</section>
<section class="titles">
  <div class="container">
    <h2><span>Call 1-877-805-6052 for Free Consultation NOW!</span></h2>
  </div>
</section>
<section id="content" class="mt30 mb30">
  <div class="container">
    <p>To schedule a callback, Please fill up this form and a customer service agent will get back in touch with you</p>
    <div class="row times">
      <form method="post" action="#" id="contactfrm" role="form" name="contact_form">
        <div class="col-sm-4">
          <div class="form-group">
            <label for="name">Name</label>
            <div id="name_error" style="display: none; color: red;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please fill the name</div>
            <input type="text" class="form-control" name="name" id="name" placeholder="Enter name"  title="Please enter your name (at least 2 characters)"/>
          </div>
          <div class="form-group">
            <label for="email">Email </label>
            <div id="email_error" style="display: none; color: red;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please fill the valid Email Id</div>
            <input type="email" class="form-control" name="email" id="email" placeholder="Enter email" title="Please enter a valid email address"/>
          </div>
          <div class="form-group">
            <label for="description">Issue description</label>
            <div id="comnt_error" style="display: none; color: red;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please fill the description</div>
            <textarea class="form-control" name="comment" id="comments" placeholder="Enter description" title="Please enter a issue description"></textarea>
          </div>
        </div>
        <div class="col-sm-4">
          <div class="form-group">
            <label for="phone">Phone </label>
            <div id="phone_error" style="display: none; color: red;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please fill the Phone Number</div>
            <div id="spcl_error" style="display: none; color: red;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please enter digits only</div>
            <input type="text" placeholder="Enter phone" class="form-control" id="phone" name="phone" onkeypress="return numbersonly(event)" required/>
          </div>
          <div class="form-group">
            <label for="email">Date & Time </label>
            <input type="text" value="2014/03/15 05:06" class="form-control" id="datetimepicker" name="datetimepicker"/>
          </div>
          <fieldset class="clearfix securityCheck">
            <label for="security">Security</label>
            <div class="form-group"> 
              <!--<img src="<?php echo TEMPLATE; ?>captcha.php" style="margin-left: 5px; margin-bottom: 2px; height: 33px;">-->
              <div id='capt_error' style="color: red; display: none;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please enter valid captcha.</div>
              <div style="float: right;"> <img src="<?php echo URL;?>captcha_code_file.php?rand=<?php echo rand();?>" id='captchaimg' style="margin-left: 5px; margin-bottom: 2px; height: 33px;" ></div>
              <div style="float: left;">
                <div style="display: none; color: red;" id="captx_error"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>Please enter the captcha code</div>
                <input class="required form-control" id="6_letters_codex" name="6_letters_codex" type="text" placeholder="Type Captcha Code">
                <input type="hidden" name="captcha_code" id="captcha_code" value="<?php echo @$_SESSION['security_code']; ?>">
              </div>
              <small style="float:left;">Can't read the image? click <a href='javascript: refreshCaptcha();'>here</a> to refresh</small> </div>
          </fieldset>
          <div style="float:left; height:76px;">&nbsp;</div>
        </div>
         <div class="col-sm-6">
          <div class="result"></div>
          <button name="submit" type="submit" class="btn btn-lg" id="send_message"> Submit</button>
          <div id="mail_success" style="display: none; color: green;"><img src='<?php echo TEMPLATE; ?>css-val/images/success.png'>mail sent</div>
          <div id="mail_fail" style="display: none; color: red;"><img src='<?php echo TEMPLATE; ?>css-val/images/error.png'>mail failed</div>
         </div>
      </form>
    </div>
  </div>
</section>

<?php fnGetHmFooter(); ?>

<script type="text/javascript" src="<?php echo TEMPLATE; ?>bootstrap/js/bootstrap.js"></script> 
<script type="text/javascript" src="<?php echo TEMPLATE; ?>js-plugin/jquery/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="<?php echo TEMPLATE; ?>js-plugin/jquery-ui/jquery-ui-1.8.23.custom.min.js"></script> 
<script type="text/javascript" src="<?php echo TEMPLATE; ?>js/custom.min.js"></script> 
<script type="text/javascript">(function($,document,undefined){var pluses=/\+/g;function raw(s){return s}function decoded(s){return decodeURIComponent(s.replace(pluses," "))}var config=$.cookie=function(key,value,options){if(value!==undefined){options=$.extend({},config.defaults,options);if(value===null)options.expires=-1;if(typeof options.expires==="number"){var days=options.expires,t=options.expires=new Date;t.setDate(t.getDate()+days)}value=config.json?JSON.stringify(value):String(value);return document.cookie=[encodeURIComponent(key),"=",config.raw?value:encodeURIComponent(value),options.expires?"; expires="+options.expires.toUTCString():"",options.path?"; path="+options.path:"",options.domain?"; domain="+options.domain:"",options.secure?"; secure":""].join("")}var decode=config.raw?raw:decoded;var cookies=document.cookie.split("; ");for(var i=0,l=cookies.length;i<l;i++){var parts=cookies[i].split("=");if(decode(parts.shift())===key){var cookie=decode(parts.join("="));return config.json?JSON.parse(cookie):cookie}}return null};config.defaults={};$.removeCookie=function(key,options){if($.cookie(key)!==null){$.cookie(key,null,options);return true}return false}})(jQuery,document);</script>
<script type="text/javascript" src="<?php echo TEMPLATE; ?>js/jquery.datetimepicker.js"></script> 

<script>

$('#datetimepicker10').datetimepicker({
    step:5,
    inline:true
});

$('#datetimepicker_mask').datetimepicker({
    mask:'9999/19/39 29:59'
});

$('#datetimepicker_start_time').datetimepicker({
    startDate:'+1970/05/01'
});

$('#datetimepicker_unixtime').datetimepicker({
    format:'unixtime'
});

$('#datetimepicker').datetimepicker();
$('#datetimepicker').datetimepicker({value:'2015/04/15 05:03',step:10});
$('#datetimepicker1').datetimepicker({
    datepicker:false,
    format:'H:i',
    step:5
});
$('#datetimepicker2').datetimepicker({
    yearOffset:222,
    lang:'ch',
    timepicker:false,
    format:'d/m/Y',
    formatDate:'Y/m/d',
    minDate:'-1970/01/02', // yesterday is minimum date
    maxDate:'+1970/01/02' // and tommorow is maximum date calendar
});
$('#datetimepicker3').datetimepicker({
    inline:true
});
$('#datetimepicker4').datetimepicker();
$('#open').click(function(){
    $('#datetimepicker4').datetimepicker('show');
});
$('#close').click(function(){
    $('#datetimepicker4').datetimepicker('hide');
});
$('#reset').click(function(){
    $('#datetimepicker4').datetimepicker('reset');
});
$('#datetimepicker5').datetimepicker({
    datepicker:false,
    allowTimes:['12:00','13:00','15:00','17:00','17:05','17:20','19:00','20:00']
});
$('#datetimepicker6').datetimepicker();
$('#destroy').click(function(){
    if( $('#datetimepicker6').data('xdsoft_datetimepicker') ){
        $('#datetimepicker6').datetimepicker('destroy');
        this.value = 'create';
    }else{
        $('#datetimepicker6').datetimepicker();
        this.value = 'destroy';
    }
});
var logic = function( currentDateTime ){
    if( currentDateTime ){
        if( currentDateTime.getDay()==6 ){
            this.setOptions({
                minTime:'11:00'
            });
        }else
            this.setOptions({
                minTime:'8:00'
            });
    }
};
$('#datetimepicker7').datetimepicker({
    onChangeDateTime:logic,
    onShow:logic
});
$('#datetimepicker8').datetimepicker({
    onGenerate:function( ct ){
        $(this).find('.xdsoft_date')
            .toggleClass('xdsoft_disabled');
    },
    minDate:'-1970/01/2',
    maxDate:'+1970/01/2',
    timepicker:false
});
$('#datetimepicker9').datetimepicker({
    onGenerate:function( ct ){
        $(this).find('.xdsoft_date.xdsoft_weekend')
            .addClass('xdsoft_disabled');
    },
    weekends:['01.01.2014','02.01.2014','03.01.2014','04.01.2014','05.01.2014','06.01.2014'],
    timepicker:false
});
</script> 
<script language='JavaScript' type='text/javascript'>
function refreshCaptcha()
{
    var img = document.images['captchaimg'];
    img.src = img.src.substring(0,img.src.lastIndexOf("?"))+"?rand="+Math.random()*1000;
    
}
</script>
</body>
</html>